import *as echarts from '../../ec-canvas/echarts'


var option1 = {
  series: [
    {
      radius:'95%',
       // 外层渐变加刻度修改大小  如改这个配置   请同步修改内圈及指针
       // 最大最小值
       min: 18,
       max: 40, 
      type: 'gauge',
      axisLine: {
        lineStyle: {
          width:20,
          color: [
            [0.06, '#65a4d9'],
            [0.33, '#47b37e'],
            [0.54, '#9ec32d'],
            [0.78, '#feb900'],
            [0.9, '#f37f18'],
            [1,'#fe4500']
          ]
        }
      },
      pointer: {
        itemStyle: {
          color: 'inherit'
        }
      },
      axisTick: {
        distance: -30,
        length: 8,
        lineStyle: {
          color: '#fff',
          width: 2
        }
      },
      splitLine: {
        distance: -30,
        length: 30,
        lineStyle: {
          color: '#fff',
          width: 4
        }
      },
      axisLabel: {
        
        color: 'inherit',
        distance:20,
        fontSize: 12
      },
      detail: {
        valueAnimation: true,
        formatter: '{value} kg/㎡',
        color: 'inherit',
        fontSize: 12
      },
      data: [
        {
          value: 18
        }
      ]
    }
  ]
};

var option2 = {
  tooltip: {
    trigger: 'item'
  },
  series: [
    {
      radius:'75%',
      name: '心率分类',
      type: 'pie',
      data: [
        { value: 1048, name: '安静心率' },
        { value: 735, name: '储备心率' },
        { value: 580, name: '最大心率' },
        { value: 484, name: '目标心率' },
        { value: 330, name: '最大运动心率' },
        { value: 310, name: '最小运动心率' },
      ],
      itemStyle: {
        normal: {
          label: {
            position: "left",
            textStyle: {
              fontWeight: "bolder",
              fontSize: "12",
              color: "#000"
            }
          },
        }
      },
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
};

let option3= {
  legend: {},
  tooltip: {},
  dataset: {
    dimensions: ['product','我的身材','最佳身材'],
    source: [ 
      ['product', '我的', '最佳'],
      ['腰围', 0,0],
      ['胸围', 0,0],
      ['手臂', 0,0],
      ['臀围', 0,0],
      ['大腿', 0,0],
      ['小腿',0,0],
      ['脚踝',0,0]
    ]
  },
  xAxis: { type: 'category' },
  yAxis: {},
  series: [
    { 
      radius:'85%',
      type: 'bar',
      itemStyle: {
        normal: {
          label: {
            show: true,
            position: "top",
            textStyle: {
              fontWeight: "bolder",
              fontSize: "12",
              color: "#000"
            }
          },
        }
      },
    },
    { 
      type: 'bar',
      radius:'85%',
      type: 'bar',
      itemStyle: {
        normal: {
          label: {
            show: true,
            position: "top",
            textStyle: {
              fontWeight: "bolder",
              fontSize: "12",
              color: "#000"
            }
          },
        }
      },
  }
  ]
};

let option4 = {
  xAxis: {
    type: 'category',
    data: ['腰围', '胸围', '臀部', '手臂', '大腿', '小腿', '脚踝']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      radius:'85%',
      data: [2,2,2,2,2,2,2],
      type: 'bar',
      showBackground: true,
      backgroundStyle: {
        color: 'rgba(180, 180, 180, 0.2)'
      }
    }
  ]
};

let option5={
  series: [
    {
      radius:'100%',
      type: 'gauge',
      startAngle: 180,
      endAngle: 0,
      min: 0,
      max: 240,
      splitNumber:1,
      itemStyle: {
        color: '#61cc73',
        shadowColor: 'rgba(0,138,255,0.45)',
        shadowBlur: 10,
        shadowOffsetX: 2,
        shadowOffsetY: 2
      },
      progress: {
        show: true,
        roundCap: true,
        width: 14
      },
      pointer: {
        icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
        length: '75%',
        width: 16,
        offsetCenter: [0, '5%']
      },
      axisLine: {
        roundCap: true,
        lineStyle: {
          width:18
        }
      },
      axisTick: {
        splitNumber: 2,
        lineStyle: {
          width: 2,
          color: '#999'
        }
      },
      splitLine: {
        length: 12,
        lineStyle: {
          width:3,
          color: '#999'
        }
      },
      axisLabel: {
        distance: 30,
        color: '#999',
        fontSize: 10
      },
      title: {
        show: false,
      },
      detail: {
        width: '100%',
        height: 40,
        borderRadius: 8,
        offsetCenter: [0, '35%'],
        valueAnimation: true,
        formatter: function (value) {
          return '{value|' + value.toFixed(0) + '}{unit|kJ/(m2·h)}';
        },
        rich: {
          value: {
            fontSize: 20,
            fontWeight: 'bolder',
            color: '#000'
          },
          unit: {
            fontSize: 14,
            color: '#000',
          }
        }
      },
      data: [
        {
          value:0
        }
      ]
    }
  ]
};

let chart

// 初始化echarts
function initChart(canvas, width, height, dpr) {
   chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // 像素
  });
  canvas.setChart(chart);
  chart.setOption(option1);
  return chart;
}

let arr=[option1,option2,option3,option5]
Page({
  data: {
    ec: {
      onInit:initChart
    },
    list:['身体指数','运动心率','最佳身材','热量代谢','AI智能'],
    active:0,
    value:'',
    myactve:null,
  },

  onChange(event) {
    let {list,myactve}=this.data
    if(myactve!=null&&event.detail.index==2){
      let arr=[option3,option4]
      chart.setOption(arr[myactve],true)//更新数据
    }else{
      this.setData({active:event.detail.index})
      wx.showToast({
        title: `切换到 ${list[event.detail.index]}模式`,
        icon: 'none',
      });
      if(event.detail.index==4){
        wx.navigateTo({
          url: '../intellect/index',
        })
        return
      }
      chart.setOption(arr[event.detail.index],true)//更新数据
    }
  },

  onShow(){
      this.setData({
        active:0
      })
  },
  getdata(txt){
      let arr=[[18.5,40],[18.5,30],[18.5,28]]
      let flag=txt.detail.flag;
      option1.series[0].min=arr[flag][0]
      option1.series[0].max=arr[flag][1]
      option1.series[0].data[0].value=txt.detail.BMInum;
      chart.setOption(option1,true)//更新数据
  },
  getHR(e){
    option2.series[0].data=e.detail
    chart.setOption(option2,true)//更新数据
  },
  setopints(e){
    let arr=[option3,option4]
    chart.setOption(arr[e.detail],true)//更新数据
    this.setData({
      myactve:e.detail
    })
  },
  // 预防图表卡顿
  beforeChange(e){
    chart.caler();
  },

  setdata(e){
    option4.series[0].data=e.detail
    chart.setOption(option4,true)//更新数据
  },
  getquantity(e){
    console.log(e)
    option5.series[0].min=1200
    option5.series[0].max=3000
    option5.series[0].data[0].value=e.detail.BMInum;
    chart.setOption(option5,true)//更新数据
  },
  setarrdata(e){ 
    let newtxtarr=['腰围','胸围','臀围']
    let txtarr=['腰围','胸围','臀围','手臂','大腿','小腿','脚踝']
    let arr=[['product', '我的', '最佳']]
    let mynewarr=[newtxtarr,txtarr]
        for(var i=0;i<mynewarr[e.detail.sexflag].length;i++){
          let newarr=[mynewarr[e.detail.sexflag][i],parseInt(e.detail.manarr[i]),e.detail.arr[i]]
          arr.push(newarr)
      }
    option3.dataset.source=arr
    chart.setOption(option3,true)//更新数据
}});